{% extends 'video/videos/index.html' %}
{% block head1 %}

  <link rel="stylesheet" href="/static/dist/css/adminlte.min.css">
  <script src="/static/plugins/jquery/jquery.min.js"></script>
{% endblock %}

{% block main%}

<div class="card card-primary">
              <div class="card-header">
                <h3 class="card-title">用户登录</h3>
              </div>
              <!-- /.card-header -->
              <!-- form start -->
              <form novalidate action="" method="post">
                  {% csrf_token  %}
                <div class="card-body">
                  <div class="form-group">
                    <label>账号</label>
                    <input type="text" class="form-control" id="username" placeholder="请输入账号">
                  </div>
                  <div class="form-group">
                    <label>密码</label>
                        <input type="password" class="form-control" id="password" placeholder="请输入密码">
                  </div>
            <label id="info">
             </label>

                <!-- /.card-body -->

                <div class="card-footer">
                    <input id="register" type="button" class="btn btn-primary" value="登录">
                </div>
                </div>
              </form>
    </div>
<script>
    $("#register").click(function () {
        $.ajax({
            url: "/api/ajax_login_data/", //后端请求地址
            type: "POST", //请求方式
            data: {//请求参数
                username: $("#username").val(),
                password: $("#password").val(),
                "csrfmiddlewaretoken": $("[name = 'csrfmiddlewaretoken']").val()
            },
            //请求成功后操作
            success: function (data) {
              $("#info").html(data.msg)
              window.location.href = '/basic/index';
            },
            //请求失败后操作
            error: function (jqXHR, textStatus, err) {
                console.log(arguments);
            },
        })
    })
</script>

{% endblock %}
